//
//  ContentView.swift
//  ChinaLandMark
//
//  Created by Felix Hi on 2021/6/28.
//

import SwiftUI

struct LandMarkDetail: View {
    @EnvironmentObject var userData: UserData
    let landmark: Landmark
    
    var landmarkIndex: Int{
        userData.userLandmarks.firstIndex { el in
            el.id == landmark.id
        }!
    }
    
    var body: some View {
        VStack {
            MapView(center: landmark.locationCoordinate)
                .edgesIgnoringSafeArea(.top)
                .frame(height: 350)
            
            Image(systemName: landmark.imageName)
                .resizable()
                .aspectRatio(contentMode: .fit)
                .scaleEffect(CGSize(width: 0.6, height: 0.6))
                .frame(width: 250, height: 250, alignment: .center)
                .clipShape(Circle())
                .overlay(Circle().stroke(Color.white, lineWidth: 6))
                .background(Circle().fill(Color.white).frame(width: 250, height: 250).shadow(radius: 10))
                .offset(y: -125)
                .foregroundColor(.orange)
                .padding(.bottom, -150)
            
            VStack(alignment: .leading, spacing: 8) {
                HStack {
                    Text(landmark.name)
                        .font(.title)
                    Button(action: {
                        self.userData.userLandmarks[self.landmarkIndex].isFavorite.toggle()
                    }) {
                        Image(systemName: self.userData.userLandmarks[self.landmarkIndex].isFavorite ? "star.fill" : "star")
                            .foregroundColor(.yellow)
                    }
                }
                HStack {
                    Text(landmark.name)
                        .font(.subheadline)
                    Spacer()
                    Text(landmark.province)
                        .font(.subheadline)
                }
            }.padding()
            
            Spacer()
        }.navigationBarTitle(Text(landmark.name), displayMode: .inline)
    }
}

struct LandMarkDetail_Previews: PreviewProvider {
    static var previews: some View {
        NavigationView {
            LandMarkDetail(landmark: landmarks[4]).environmentObject(UserData())
        }
    }
}
